<template>
	<view class="container">
		<block v-if="isload">
			<view class="header">
				<image :src="right_img"></image>
				<text v-if="detail.status == 1" style="color:#191919;font-size: 38rpx;">付款成功</text>
				<text v-else style="color:red;font-size: 38rpx;">未付款</text>
			</view>

			<view class="orderinfo">
				<view class="item" v-if="business">
					<text class="t1">收款方:</text>
					<text class="t2">{{ business.name }}</text>
				</view>
				<view class="item">
					<text class="t1">订单号:</text>
					<text class="t2">{{ detail.ordernum }}</text>
				</view>

				<view class="item">
					<text class="t1">订单金额:</text>
					<text class="t2">￥{{ detail.money }}</text>
				</view>
				<view class="item">
					<text class="t1">实付金额:</text>
					<text class="t2">￥{{ detail.paymoney }}</text>
				</view>
				<view class="item">
					<text class="t1">付款方式:</text>
					<text class="t2">{{ detail.paytype || '' }}</text>
				</view>
				<view class="item" v-if="detail.status > 0 && detail.paytime">
					<text class="t1">付款时间:</text>
					<text class="t2">{{ detail.paytime }}</text>
				</view>

				<view class="item" v-if="detail.businessdisprice > 0">
					<text class="t1">店铺折扣抵扣:</text>
					<text class="t2">-￥{{ detail.businessdisprice }}</text>
				</view>

				<view class="item" v-if="detail.fullmoney > 0">
					<text class="t1">店铺满减抵扣:</text>
					<text class="t2">-￥{{ detail.fullmoney }}</text>
				</view>

				<view class="item" v-if="detail.scoredk > 0">
					<text class="t1">{{ t('积分') }}抵扣:</text>
					<text class="t2">-￥{{ detail.scoredk }}</text>
				</view>

				<view class="item" v-if="detail.couponrid">
					<text class="t1">{{ t('优惠券') }}抵扣</text>
					<text class="t2">-￥{{ detail.couponmoney }}</text>
				</view>
				<view class="item" v-if="couponrecord">
					<text class="t1">{{ t('优惠券') }}名称</text>
					<text class="t2">{{ couponrecord.couponname }}</text>
				</view>
			</view>

			<view class="giveinfo" @click="goIndex()" v-if="detail.givesource > 0">
				<view class="giveinfoimg">
					<image :src="givehongbao_img"></image>
				</view>
				<view class="givecontent">
					<view class="givecontentitem">￥<text>{{ detail.givesource }}</text>{{ t('积分') }}</view>
				</view>
			</view>

			<!--<view style="text-align: center;margin-top: 80rpx;">
			<cell styleType="3" :startmessage='startmessage' :completemessage="completemessage" plugid='4562959c91e1f78f4442fd723e8e96aa'  />
		</view>-->

		</block>
		<loading v-if="loading"></loading>
		<dp-tabbar :opt="opt"></dp-tabbar>
		<popmsg ref="popmsg"></popmsg>
	</view>
</template>

<script>
var app = getApp();

export default {
	data() {
		return {
			opt: {},
			loading: false,
			isload: false,
			menuindex: -1,

			detail: {},
			couponrecord: {},
			mendian: {},
			business: {},
			pre_url: getApp().globalData.pre_url,
			right_img: getApp().globalData.static_url + '/static/images/right.png',
			wx_img: getApp().globalData.static_url + '/static/images/wx_img.png',
			member_img: getApp().globalData.static_url + '/static/images/member_img.png',
			givehongbao_img: getApp().globalData.static_url + '/static/images/givehongbaobg3.png',
		};
	},

	onLoad: function (opt) {
		this.opt = app.getopts(opt);
		this.getdata();
	},
	onPullDownRefresh: function () {
		this.getdata();
	},
	methods: {
		completemessage(e) {
			console.log(e, 888888888)
		},
		getdata: function (option) {
			var that = this;
			that.loading = true;
			app.get('Facepay/facepaydetail', { id: that.opt.id }, function (res) {
				that.loading = false;
				that.detail = res.detail;
				that.couponrecord = res.couponrecord;
				that.mendian = res.mendian;
				that.business = res.business;
				that.loaded();
			});
		},
		goBusiness() {
			if (this.detail.bid > 0) {
				uni.reLaunch({
					url: "/pages/business/index?id=" + this.detail.bid
				})
			} else {
				uni.switchTab({
					url: "/pages/index/index"
				})
			}

		},
		showhxqr: function () {
			this.$refs.dialogHxqr.open();
		},
		closeHxqr: function () {
			this.$refs.dialogHxqr.close();
		},
		goIndex() {
			uni.navigateTo({
				url: "/activity/scoreshop/index",
				fail(e) {
					console.log(e)
				}
			})
		}

	}
};
</script>
<style>
page {
	background-color: #f7f7f7;
}

.chatcontent {
	display: flex;
	/* justify-content: space-between; */
	margin: 20rpx 3% 10rpx 3%;
	border-radius: 5px;
	padding: 14rpx 3%;
	background: #fefefe;
}

.chatcontent image {
	width: 120rpx;
	height: 120rpx;
	border-radius: 6rpx;
}

.groupchat {
	margin-left: 20rpx;
	text-align: left;
	width: 60%;
}

.groupchatname {
	margin-top: 5rpx;
	display: flex;
	align-items: center;

}

.groupchatname text {
	color: #292828;
	font-size: 32rpx;
}

.groupchatname image {
	width: 40rpx;
	height: 40rpx;
	margin-right: 8rpx;
}

.groupchatnumber {
	display: flex;
	align-items: center;
	color: #7e7e7e;
	margin-top: 25rpx;
}

.groupchatnumber image {
	width: 35rpx;
	height: 35rpx;
	margin-right: 8rpx
}

.groupchatnumber text {
	color: #292828;
	font-size: 30rpx;

	margin-right: 4rpx;
}

.addchat {
	width: 130rpx;
	border-radius: 8rpx;
	color: #fff;
	height: 68rpx;
	line-height: 68rpx;
	margin-top: 32rpx;
}

.header {
	position: relative;
	width: 94%;
	margin: 20rpx 3%;
	border-radius: 5px;
	padding: 50rpx;
	background: #fff;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
}

.header image {
	width: 42rpx;
	height: 42rpx;
	margin-right: 12rpx;
}

.orderinfo {
	width: 94%;
	margin: 20rpx 3%;
	border-radius: 5px;
	padding: 20rpx 20rpx;
	padding: 14rpx 3%;
	background: #FFF;
}

.orderinfo .item {
	display: flex;
	width: 100%;
	padding: 20rpx 0;
	border-bottom: 1px solid #ededed;
}

.orderinfo .item:last-child {
	border-bottom: 0;
}

.orderinfo .item .t1 {
	padding-right: 24rpx;
	color: #7e7e7e;
}

.orderinfo .item .t2 {
	flex: 1;
	color: #48484a;
}

.orderinfo .item .red {
	color: red
}

.goBusiness {
	color: #d5ca94;
	text-align: center;
	width: 90%;
	margin: auto;
	border-radius: 12rpx;
	border: 2rpx solid #e8622d;
	padding: 30rpx 0rpx;
	background-color: #fff;
	margin-top: 48rpx;
	margin-buttom: 48rpx;
}

.giveinfo {
	position: relative;
	width: 100%;
	margin: auto;
	text-align: center;
	padding: 14rpx 3%;
}

.givetitle {
	color: #7c7c7c;
	font-size: 28rpx;
	margin: 40rpx 0rpx;
}

.givecontent {
	/*background: linear-gradient(#dd5734, #df7539);
	border-radius: 12rpx;
	padding: 40rpx;*/
	color: #fff;
	display: flex;
	justify-content: space-between;
	position: absolute;
}

.hxqrbox {
	background: #fff;
	padding: 50rpx;
	position: relative;
	border-radius: 20rpx
}

.hxqrbox .img {
	width: 400rpx;
	height: 400rpx
}

.hxqrbox .txt {
	color: #666;
	margin-top: 20rpx;
	font-size: 26rpx;
	text-align: center
}

.hxqrbox .close {
	width: 50rpx;
	height: 50rpx;
	position: absolute;
	bottom: -100rpx;
	left: 50%;
	margin-left: -25rpx;
	border: 1px solid rgba(255, 255, 255, 0.5);
	border-radius: 50%;
	padding: 8rpx
}

.giveinfoimg image {
	width: 100%;
	height: 360rpx;
	margin: auto;
	text-align: center;
}

.givecontent {
	color: #ea432f;
	font-size: 50rpx;
	font-weight: 600;
	z-index: 2;
	width: 100%;
	height: 100%;
	top: 0;
	right: 20rpx;
	left: 0;
}

.givecontent text {
	padding: 0rpx 10rpx;
	text-align: center;
	font-size: 56rpx;
}

.givecontentitem {
	width: 100%;
	margin: auto;
	margin-top: 19%;
}
</style>